<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-07-30 20:02:30
 * @LastEditTime: 2020-02-28 11:25:38
 * @LastEditors: Please set LastEditors
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title></title>
    <link rel="stylesheet" type="text/css" href="../css/vant.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <script type="text/javascript" src="../script/vue.min.js"></script>
    <script type="text/javascript" src="../script/vant.min.js"></script>
    <script type="text/javascript" src="../script/base.js"></script>
    <script type="text/javascript" src="../script/jquery.js"></script>
    <script type="text/javascript" src="../script/ajaxFileUpload.js"></script>
    <script type="text/javascript" src="../script/layer/mobile/layer.js"></script>
    <style type="text/css">
        .content {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }

        .mainForm {
            display: flex;
            flex-wrap: wrap;
            background-color: #fff;
        }

        .mainForm .van-field {
            width: 33.3%;
        }

        .van-field__label {
            width: auto;
        }

        .table table {
            padding: 0;
            margin: 0;
            width: 100%;
            border-collapse: collapse;
            color: #fff;
            table-layout: fixed;
        }

        .table table tr:nth-child(even) {
            background-color: #e7e7e7;
        }

        .table table tr:nth-child(odd) {
            background-color: #e7e7e7;
        }


        .table table tr:nth-child(even) input {
            background-color: #e7e7e7;
        }

        .table table tr:nth-child(odd) input {
            background-color: #e7e7e7;
        }


        .table table tr th {
            text-align: center;
            color: #fff;
            font-size: 18px;
            height: 34px;
            white-space: nowrap;
            padding: 0 5px;
            border: 1px solid #808080;
            background-color: #4ba2f9;
            position: sticky;
            white-space: nowrap;
            overflow-x: scroll;
        }




        .table table tr input {
            font-size: 18px;
        }



        .table table tr td {
            text-align: center;
            font-size: 18px;
            height: 34px;
            white-space: nowrap;
            padding: 0 5px;
            border: 1px solid #808080;
            color: #000;
            position: relative;
            overflow-x: scroll;
        }

        .table table tr td .text {
            position: absolute;
            right: 0;
            top: 0;
            display: inline-block;
            width: 100%;
            height: 100%;
        }

        .table table tr td input {
            border: none;
        }

        .f {
            width: 100%;
            display: flex;
            justify-content: space-between;
            /* padding: 1.5% 1%; */
            background-color: #f5f5f5;
        }

        .van-button {
            margin: auto 10px;
            width: 100%;
            border: none;
        }

        .bottomBtn {
            width: 100%;
            display: flex;
            justify-content: space-between;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="box">
            <van-nav-bar :title="name + '明细'" id="safeTop" left-arrow @click-left="onClickLeft">
            </van-nav-bar>
            <div class="content">
                <div>
                    <div class="mainForm">
                        <van-field v-model="formData.Define1Name" label="报工类型" placeholder="请填写报工类型"></van-field>
                        <van-field v-model="formData.SCDate" label="生产日期" placeholder="请选择生产日期"></van-field>
                        <van-field v-model="formData.ProcedureName" label="工序" placeholder="请选择工序"></van-field>
                        <van-field v-model="formData.FSumQty" label="报工数量" placeholder="自动带出报工数量"></van-field>
                        <van-field v-model="formData.FDailyQtt" label="合格数量" placeholder="请输入合格数量"></van-field>
                        <van-field v-model="formData.FNgQty" label="不合格数量" placeholder="由不良报废自动带出"></van-field>
                        <van-field v-model="formData.FProcessManName" label="生产人员" placeholder="自动带出生产人员"></van-field>
                        <van-field v-model="formData.EquipmentName" label="线体" placeholder="自动带出线体"></van-field>
                        <van-field v-model="formData.ApproveName" label="审核状态" placeholder="自动带出审核状态"></van-field>
                        <van-field v-model="formData.Approver" label="审核人" placeholder="自动带出审核人"></van-field>
                        <van-field v-model="formData.ApproveTime" label="审核时间" placeholder="自动带出审核时间"></van-field>
                        <!-- <van-field v-model="formData.PieceTime1" label="计件计时" placeholder="请选择计时计件"></van-field> -->

                        <van-field v-model="formData.PieceTime1" label="计件计时" placeholder="请选择计件计时" readonly is-link
                            @click="ClickPieceTime1"></van-field>
                        <van-field v-model="formData.ManHour" label="工时:" placeholder="请输入工时" type='number'
                            v-show="formData.PieceTime1=='计时'"></van-field>
                        <van-field v-model="formData.FRemarks" label="备注" placeholder="请输入备注"></van-field>
                    </div>
                    <div class="table">
                        <table>
                            <tr>
                                <th width='15%'>派工单编号</th>
                                <th width='38%'>产品名称</th>
                                <th width='9%'>派工数量</th>
                                <th width='9%'>完成数量</th>
                                <th width='12%'>可报工数量</th>
                                <th>未审核报工数量</th>
                            </tr>
                            <tr>
                                <td><input type="text" v-model="formData.PGBillNo" disabled></input></td>
                                <td>
                                    <div class="td_div">
                                        <div class="ListTdDiv"><text>{{formData.ProductName}}</text></div>
                                    </div>
                                </td>
                                <td><input type="text" disabled v-model="formData.FPlanQty"></input></td>
                                <td><input type="text" disabled v-model="formData.WCQty"></input></td>
                                <td><input type="text" disabled v-model="formData.ReportQty"></input></td>
                                <td><input type="text" disabled v-model="formData.NotApproveQty"></input></td>
                            </tr>
                        </table>

                    </div>
                </div>
                <div class="bottomBtn">
                    <van-button type="info" style="background-color: #ffce04;"> 不&nbsp良&nbsp输&nbsp入 </van-button>
                    <van-button type="danger"> 异&nbsp常&nbsp提&nbsp交</van-button>
                </div>
                <!-- <div class="bottomBtns2">
                    <button class="button0" block>
                        不良输入
                    </button>
                    <button class="button1" block>
                        异常提交
                    </button>
                    <button class="button3" block @click="submit('保存')"
                        v-show='ApproveButton=="保存"||ApproveButton=="未审核"'> 报工提交 </button>
                    <button v-if="ApproveBack('审核')" class="button2" block @click='toexamine'
                        v-show='baseFormData.ApproveName=="未审核"&&ApproveButton=="未审核"'>
                        审核
                    </button>
                    <button v-if="ApproveBack('审核')" class="button2" block @click='continueWork'
                        v-show='baseFormData.ApproveName=="已审核"&&ApproveButton=="已审核"'>
                        继续报工
                    </button>
                </div> -->
            </div>



            <audio id="audioPlayer" preload="auto">
                <source src="../image/aigei_com.mp3" type="audio/mpeg">
            </audio>
            <div class="indexBottom">
                汇智云创 技术支持
            </div>
        </div>

        <van-action-sheet v-model="PieceTimeShow" :actions="PieceTimeList" @select="onSelectPieceTime">
        </van-action-sheet>
    </div>
</body>

<script type="text/javascript">
    var vm;
    apiready = function () {
        var photoBrowser = api.require('photoBrowser');

        api.addEventListener({
            name: 'getCDAlarmLList'
        }, function (ret) {
            APP.getCDAlarmLList()
        })
        api.addEventListener({
            name: 'getYCKBDataLiist'
        }, function (ret) {
            APP.getYCKBDataLiist()
        })
        vm = new Vue({
            el: '#app',
            data: {
                name: api.pageParam.name,
                formData: {
                    FSumQty: '',
                    FDailyQtt: '',
                    FNgQty: '',
                    PieceTime1: '',
                    PieceTime: 0,
                    obOrderID: 0,
                    illNO: "0",
                    illDate: ":",
                    roductID: 0,
                    roductName: "",
                    eportQty: 0,
                    PlanQty: 0,
                    CQty: 0,
                    DailyQtt: null,
                    NGQty: 0,
                    StateName: "",
                    rocedureName: "",
                    obPROCID: 0,
                    JobDocTypeID: 0,
                    Define1: '',
                    Define1Name: '',
                    TypeName: "",
                    FProcessMan: '',
                    FProcessManName: '',
                    FWorkshopID: 0,
                    SCDate: '',
                    ProcedureID: 0,
                    WoOrderID: 0,
                    EquipmentName: '',
                    EquipmentID: 0,
                    ShiftID: 0,
                    InspectionID: null,
                    ApproveName: '',
                    FRemarks: ''
                },
                tableData: [],
                PieceTimeShow: false,
                PieceTimeList: [
                    {
                        name: '计时',
                        id: 1
                    },
                    {
                        name: '计件',
                        id: 0
                    }
                ],
            },
            created: function () {
                var that = this;
                window.localStorage.setItem('pageName', JSON.stringify(that.name))
                if (api.pageParam.FDailyOutputID) {
                    APP.ajax('getCDPlanDetail', { FDailyOutputID: api.pageParam.FDailyOutputID }, function (res) {
                        console.log(JSON.stringify(res));

                    })
                }
                else {
                    that.addqueryList()
                }

            },
            mounted() {
                APP.setSafeTop()
                APP.keyBoardChange()
            },
            methods: {
                onSelectPieceTime(e) {
                    var that = this
                    this.formData.PieceTime1 = e.name
                    this.formData.PieceTime = e.id
                    this.PieceTimeShow = false
                    this.$forceUpdate()
                },
                ClickPieceTime1() {
                    var that = this
                    this.PieceTimeShow = true
                },
                addqueryList() {
                    var that = this

                    console.log(JSON.stringify(APP.getUserInfo()));
                    this.$set(this.formData, 'FNgQty', 0)
                    this.$set(this.formData, 'FDailyQtt', 0)
                    // this.formData.FProcessManName =APP.getUserInfo().EmplName
                    // this.formData.FProcessMan = APP.getUserInfo().EmplID
                    // this.formData.EquipmentName = this.$set(this.formData, 'EquipmentName', this.$store.state
                    //     .GuyueModule.MesBasicInfo.warehouse.EquipmentName)
                    // this.formData.ShiftID = this.$store.state.GuyueModule.MesBasicInfo.className.id
                    // this.formData.EquipmentID = this.$store.state.GuyueModule.MesBasicInfo.warehouse.EquipmentID
                    this.formData.SCDate = APP.getFormatDate(new Date()).split(' ')[0]
                    this.formData.PieceTime1 = '计件'
                    this.formData.PieceTime = 0
                },
                onClickLeft() {
                    var that = this
                    api.sendEvent({
                        name: 'refreshreportingDetailList'
                    })
                    api.closeWin()
                },
            }
        })
    };
</script>

</html>